
import { View } from "@tarojs/components"
import { HOME_PAGES_TAB_ITEM } from "../home/constants"
import { IconFont } from "../theme"
import { switchTabUrl } from "../utils"
import Taro from "@tarojs/taro"
import { useDispatch } from "react-redux"

export const TTabs = (props: { currentName: string }) => {
    const list = [HOME_PAGES_TAB_ITEM]
    const { currentName } = props
    // const { handleScan } = useScan()
    const dispatch = useDispatch()

    // 暂时
    const handleScan = (e) => {
        e.stopPropagation()
        Taro.scanCode({
            success: async (res) => {
                const { result } = res
                console.log(result)

            }
        })
    }

    return (
        <View className="w-full h-[167.69px] px-pageX flex flex-col justify-end fixed bottom-pageX left-0 ">
            <View className="w-full h-[104px]  bg-white rounded-full flex items-center justify-between relative">
                {
                    list.map((item, index) => {
                        return (
                            <View key={index} className="flex items-center justify-center w-[246px] h-full " onClick={() => { switchTabUrl(`/${item.pagePath}`) }}>
                                <IconFont name={item.iconName} size={51} color={item.text === currentName ? item.activeColor : item.normalColor} />
                            </View>
                        )
                    })
                }

                {/* <View className="w-[167.69px] h-[167.69px] bg-white flex items-center justify-center rounded-full absolute bottom-0 left-[246px] z-10" onClick={() => { switchTabUrl(`/${MEMBER_CARD_TAB.pagePath}`) }}>
                    <View className="bg-brand-1 w-[125.77px] h-[125.77px] rounded-full flex items-center justify-center">
                        <Image src={qrCode} className="w-[65px] h-[65px]" />
                    </View>
                </View> */}
                <View className="w-[167.69px] h-[167.69px] bg-white flex items-center justify-center rounded-full absolute bottom-0 left-[246px] z-10" onClick={(e) => { handleScan(e) }}>
                    <View className="bg-brand-1 w-[125.77px] h-[125.77px] rounded-full flex items-center justify-center">
                        <IconFont name='a-qr-scan21' size={65} color={'white'} />
                    </View>
                </View>
            </View>
        </View >
    )
}